<template>
  <div id="pagepanelname">
    <div>
      <ViewerRptShow ref="viewerRptShowRef" :isShowParamPanel="true" />
    </div>
  </div>
</template>
<script setup lang="ts">
import { ref, reactive, getCurrentInstance, onMounted, computed, toRefs, watch } from 'vue';
import '@grapecity/ar-viewer/dist/jsViewer.min.js';
import '@grapecity/ar-viewer/dist/jsViewer.min.css';
import ViewerRptShow from '@/views/system_set/reports/components/ViewerRptShow.vue';

let { proxy }: any = getCurrentInstance();

let reportList = reactive([]);
let selectedRpt: any = ref('');
let reportParameter = reactive({}) as any;
let viewerRptShowRef = ref(null);/**报表对象 */

watch(
  () => proxy.$router.currentRoute,
  (to, from) => {
    proxy.$nextTick(() => {
      selectedRpt.value = proxy.$route.query.param;
      setTimeout(() => {
        const a = {
          id: 't' + new Date().valueOf(),
          reportId: proxy.$route.query.param,
          reportParams: null
        };
        Object.assign(reportParameter, a);
        viewerRptShowRef.value?.refreshRpt(reportParameter);
      }, 500);
    });
  }
);

onMounted(() => {
  selectedRpt.value = proxy.$route.query.param;
  const a = {
    id: 't' + new Date().valueOf(),
    reportId: proxy.$route.query.param,
    reportParams: null
  };
  Object.assign(reportParameter, a);
  viewerRptShowRef.value?.refreshRpt(reportParameter);
});

</script>
<style lang="scss" scoped >
#pagepanelname {
  background-color: #fff;
  overflow-x: hidden;
}

#content {
  height: unset !important;
}
</style>